<?xml version='1.0' encoding='UTF-8' ?>
<!--
    Document   : baseProperty
    Created on : Jan 28, 2012, 12:14:06 PM
    Author     : Oscar Ivan Prado
-->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:pcore="http://www.pfaces.org/pfaces/core"
                xmlns:ace="http://www.pfaces.org/pfaces/components"
                xmlns:p="http://primefaces.org/ui">
    <table>
                <tr>
                    <td align="left">
                        <p:inputText value="#{variableBackingBean.newProperty.name}" disabled="#{disabled}" id="newPropertyName"/>
                    </td>
                    <td align="right">
                        <p:inputText value ="#{variableBackingBean.newProperty.value}" style="width: 150px" id="newPropertyValue"/>
                    </td>
                    <td>
                        <p:commandButton actionListener="#{variableBackingBean.onCreate()}"  icon="ui-icon-plusthick" update="variables, newPropertyName, newPropertyValue"/>
                    </td>
                </tr>
            </table>
    <p:dataGrid value="#{variableBackingBean.variables}" var="var" columns="1" id ="variables">
        <p:column style="background-color: white; border: #ffffff">
            <table>
                <tr>
                    <td align="left">
                        <p:inputText value="#{var.name}" disabled="#{disabled}" style="width: 110px" />
                    </td>
                    <td align="right">
                        <p:inputText value ="#{var.value}" style="#{valueStyle}"/>
                    </td>
                    <td>
                        <p:commandButton  actionListener="#{variableBackingBean.onModfy(var)}" icon="ui-icon-check"/>
                    </td>
                    <td align="right">
                        <p:commandButton   actionListener="#{variableBackingBean.onRemove(var)}" icon="ui-icon-closethick"/>
                    </td>
                </tr>
            </table>
        </p:column>
    </p:dataGrid>
</ui:composition>